<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>PixiJS Filter Screenshots</title>
    <style>
      body {
        margin: 0;
        padding: 0;
        width: 100vw; 
        height: 100vh;
        background-image:
          linear-gradient(45deg, #ccc 25%, transparent 25%), 
          linear-gradient(135deg, #ccc 25%, transparent 25%),
          linear-gradient(45deg, transparent 75%, #ccc 75%),
          linear-gradient(135deg, transparent 75%, #ccc 75%);
        background-size:25px 25px; /* Must be a square */
        background-position:0 0, 12.5px 0, 12.5px -12.5px, 0px 12.5px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
      }
      body.only {
        display: block;
      }
      img, canvas {
        width: 100%;
        display: block;
      }
    </style>
  </head>
  <body>
    <script>
      require('./renderer.js');
    </script>
  </body>
</html>